<!DOCTYPE html>
<html>
<head>
	<title>后台</title>
	<meta charset="utf-8">
	<script type="text/javascript" src="/bower_components/jquery/dist/jquery.min.js"></script>
	<script type="text/javascript" src="/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
	<link rel="stylesheet" type="text/css" href="/bower_components/bootstrap/dist/css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="styles/admin.css">
</head>
<body>
	<div class="top">
		<div class="container">
			欢迎<span><%= username %></span>
			<a href="/adminusers/register">注册</a>
			<a href="/admin/signout">退出登录</a>
		</div>
	</div>
	<div class="container">
		<div class="alert_top">
			<% if(success!=''){ %>
				<div class="alert alertList alert-success alert-dismissible" role="alert">
					<span class="error"> <%= success %> </span>
					<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
				</div>
			<% }%>
		</div>
		<h1>产品列表
			<a class="pull-right btn btn-success" href="/admin/addProduct">添加产品</a>
		</h1>
		<table class="table table-striped table-bordered table-hover table-condensed">
			<tr>
				<th>序号</th>
				<th>产品分类</th>
				<th>产品简介</th>
				<th>图片</th>
				<th>价格</th>
				<th>操作</th>
				<th>操作</th>
			</tr>
			<% for(var i=0; i<item.length; i++) {%>
				<tr>
					<td><%=item[i].aid %></td>
					<td><%=item[i].name %></td>
					<td class="alignLeft"><%=item[i].abstract %></td>
					<td><img src="<%=item[i].img%>"></td>
					<td>¥<%=item[i].price%></td>
					<td>
						<a class="edit" href="/admin/editProduct?id=<%=item[i].aid%>">查看/修改</a>
					</td>
					<td>
						<a class="btn btn-danger" href="/admin/delProduct?id=<%=item[i].aid%>">删除</a>
					</td>
				</tr>
			<%  } %>
		</table>
		<nav aria-label="Page navigation">
			<ul class="pagination">
				<li>
					<a class="pageup" href="/admin?page=1"><span>&laquo;&laquo;</span></a>
					<a class="pageup" href="/admin?page=<%=page_id%>"><span>&laquo;</span></a>
				</li>
				<% for(var i=0; i<page; i++) {%>
					<li <% if(i==page_id){%>class="active"<%}%>>
						<a href="/admin?page=<%=i+1%>" aria-label="Previous"><%=i+1%></a>
					</li>
				<%  } %>
				<li>
					<a class="pagedown" href="/admin?page=<%=page_id+2%>"><span>&raquo;</span></a>
					<a class="pagedown" href="/admin?page=<%=page%>"><span>&raquo;&raquo;</span></a>
				</li>
			</ul>
		</nav>
	</div>
	<script type="text/javascript">
		var pid = <%=page_id+1%>;
		var pageL = <%=page%>;
		setTimeout(function(){
			$(".alert").css("transform","translate(0px,-34px)");
		},3000)
		if (<%=page_id%>==0) {
			$('.pageup').removeAttr("href")
		}
		if (<%=page_id%>==<%=page-1%>) {
			$('.pagedown').removeAttr("href");
		}
		for (var i = 2; i < pageL; i++) {
			if ($('nav li:eq("'+i+'")').index()<pid-2 || $('nav li:eq("'+i+'")').index()>pid+2) {
				$('nav li:eq("'+i+'")').css('display','none');
			}
		}
		if (pid>5 ) {
			$('nav li:eq(1)').after("<li><a>...</a></li>")
		}
		if (pid<pageL-5) {
			$('nav li:eq("'+pageL+'")').before("<li><a>...</a></li>")
		}
	</script>
</body>
</html>
